<template>
  <a-tabs v-model:activeKey="activeKey">
    <a-tab-pane key="1" tab="热门">
      <vrecommend></vrecommend>
    </a-tab-pane>
    <a-tab-pane key="2" tab="文章" force-render>
      <varticle :listdata="listdata"></varticle>
    </a-tab-pane>
    <a-tab-pane key="3" tab="动态">
      <vinformal :listDynamic="listDynamic"></vinformal>
    </a-tab-pane>
  </a-tabs>
</template>

<script>
// import { useRoute } from "vue-router";
import { defineComponent, ref } from "vue";
import vrecommend from "../userHome/recommend";
import varticle from "../userHome/article";
import vinformal from "../userHome/informal";
import VueEvent from "../../utils/event";
import { userBodyAs, userBodyMs } from "../../api/showUser";

export default defineComponent({
  setup() {
    // const route = useRoute();
    let activeKey = ref("1");

    const listdata = ref([]);
    const listDynamic = ref([]);

    VueEvent.on("userTop", (e) => {
      userBodyAs({
        url: "/showUsers/userBodyAs",
        userid: e.uid,
        success: (res) => {
          // console.log(res.data);
          listdata.value.length = 0;
          for (let i = 0; i < res.data.UserAsList.length; i++) {
            listdata.value.push({
              aid: res.data.UserAsList[i].aid,
              author: res.data.UserAsList[i].name,
              title: res.data.UserAsList[i].title,
              description: res.data.UserAsList[i].intr,
              coverImg: res.data.UserAsList[i].coverImg,
              viewNum: res.data.UserAsList[i].viewNum,
              likeNum: res.data.UserAsList[i].likeNum,
              collectionNum: res.data.UserAsList[i].collectionNum,
              commentNum: res.data.UserAsList[i].commentNum,
            });
          }
        },
        err: (err) => {
          console.log(err);
        },
      });
      userBodyMs({
        url: "/showUsers/userBodyMs",
        userid: e.uid,
        success: (res) => {
          // console.log(res.data);
          listDynamic.value.length = 0;
          for (let i = 0; i < res.data.UserMsList.length; i++) {
            listDynamic.value.push({
              did: res.data.UserMsList[i].did,
              imgHead:
                "http://localhost:3000/" + res.data.UserMsList[i].imgHead,
              author: res.data.UserMsList[i].name,
              showtime: res.data.UserMsList[i].showtime,
              content: res.data.UserMsList[i].content,
              likeNum: res.data.UserMsList[i].likeNum,
              collectionNum: res.data.UserMsList[i].collectionNum,
              picList: res.data.UserMsList[i].picList,
              commentNum: res.data.UserMsList[i].commentNum,
            });
          }
          // console.log(listDynamic.value);
        },
        err: (err) => {
          console.log(err);
        },
      });
    });

    VueEvent.on("userBody2", () => {
      activeKey.value = "2";
    });

    return {
      activeKey,
      listdata,
      listDynamic,
    };
  },
  components: {
    vrecommend,
    varticle,
    vinformal,
    // useRoute,
  },
});
</script>

<style scoped>
</style>